<template>
  <div class="app-container">
    <complex-table :ref="tableRef" :datas="tableData" />
  </div>
</template>

<script>
import ComplexTable from '@/components/ComplexTable/index'
import ContentBox from '@/layout/components/ContentBox'
import { MD5 } from '@/utils'
import { tree as searchApi } from '@/api/sys/menu'

export default {
  name: 'Menu'
  , components: { ComplexTable, ContentBox }
  , data() {
    return {
      tableRef: MD5(this.$vnode.key + this.$vnode.tag)
      , tableData: {
        full: 222
        , title: '菜单管理'
        , page: false // 开启分页
        , rowKey: 'title'
        , searchList: searchApi // 搜索接口
        , cols: [[ // 表头
          { field: 'title', type: 'string', search: true, title: '菜单名称', width: 120, fixed: 'left' }
          , { field: 'icon', type: 'icon', title: '图标', align: 'center', sort: false }
          , { field: 'name', type: 'string', title: '英文标识' }
          , { field: 'path', type: 'string', title: '前端路由' }
          , { field: 'component', type: 'string', title: '模板路径' }
          , { field: 'is_show', type: 'selections', title: '状态', align: 'center', width: 110, selections: [
            { label: '显示', value: 1 }
            , { label: '隐藏', value: 0 }
          ] }
          , { field: 'is_url', type: 'selections', title: '是否为链接', align: 'center', width: 110, selections: [
            { label: '是', value: 1 }
            , { label: '否', value: 0 }
          ] }
          , { field: 'sort', type: 'integer', title: '排序' }
        ]]

        , buttonBars: [
          {
            type: 'danger'
            , title: '删除'
            , icon: 'el-icon-delete'
            , event: this.delsAction
            , disabled: (selections) => {
              return !selections || selections.length <= 0
            }
          }
        ]
      }
    }
  }
  , created() {

  }
  , methods: {
    // 刷新表格
    tableReload() {
      this.$refs[this.tableRef].getList()
    }
  }
}
</script>
